<!-- liyang 2018/09/13 新闻列表 -->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset='utf-8'>
    <title> - 若维俱乐部 </title>
    <meta name='keywords' content=''>
    <meta name='description' content=''>
    <link rel="stylesheet" href="css/public.css">
    <link rel="stylesheet" href="css/header.css">
    <link rel="stylesheet" href="css/footer.css">
    <link rel="stylesheet" href="css/newslist.css">
</head>

<body>
    <!-- 引入头部 开始 只有开服务器才可以看到效果，否则会提示无法引入本地js -->
    <div id="headerPage"></div>
    <!-- 引入头部 结束 -->

    <!-- 内容 开始 -->
    <div class="content">
        <!-- 去掉左边的空白 开始 -->
        <div class="lists">
            <!-- 左侧 开始 -->
            <div class="left fl">

                <ul class="newslist" id="newslist">
                
                </ul>

                <!-- 分页 开始 -->
                <div class="page">
                    <div class="buttons">
                        <button class="newsBtn active" onclick="window.location.href='#'">1</button>
                        <button class="newsBtn" onclick="window.location.href='#'">2</button>
                        <button class="newsBtn" onclick="window.location.href='#'">3</button>
                        <button class="newsBtn" onclick="window.location.href='#'">4</button>
                    </div>

                </div>
                <!-- 分页 结束 -->
            </div>
            <!-- 左侧 结束 -->

            <!-- 右侧 开始 -->
            <div class="right fr">
                <!-- 搜索 标题 开始 -->
                <div class="title">
                    搜索你感兴趣的
                </div>
                <!-- 搜索 标题 结束 -->
                <!-- 蓝色分割线 开始 -->
                <div class="borders"></div>
                <!-- 蓝色分割线 结束 -->
                <!-- 搜索 开始 -->
                <input class="search" placeholder="搜索你想要的！！！    未写好" />
                <!-- 搜索 结束 未写好 -->

                <!-- 资讯 标题 开始 -->
                <div class="title">
                    最热资讯
                </div>
                <!-- 资讯 标题 结束 -->
                <!-- 蓝色分割线 开始 -->
                <div class="borders"></div>
                <!-- 蓝色分割线 结束 -->
                <!-- 资讯内容开始 -->
                <div class="row">
                    <!-- 图片 开始 -->
                    <div class="left fl">
                        <img src="images/多条新闻编播.png">
                    </div>
                    <!-- 图片 结束 -->
                    <!-- 文字 开始 -->
                    <div class="right fr">
                        <div class="top">
                            <span>8-14, 2018</span>
                        </div>
                        <div class="bottom">
                            <a href="#">这里是若维俱乐部的新闻内容...</a>
                        </div>
                    </div>
                    <!-- 文字 结束 -->
                </div>
                <div class="row">
                    <!-- 图片 开始 -->
                    <div class="left fl">
                        <img src="images/多条新闻编播.png">
                    </div>
                    <!-- 图片 结束 -->
                    <!-- 文字 开始 -->
                    <div class="right fr">
                        <div class="top">
                            <span>8-14, 2018</span>
                        </div>
                        <div class="bottom">
                            <a href="#">这里是若维俱乐部的新闻内容...</a>
                        </div>
                    </div>
                    <!-- 文字 结束 -->
                </div>
                <div class="row">
                    <!-- 图片 开始 -->
                    <div class="left fl">
                        <img src="images/多条新闻编播.png">
                    </div>
                    <!-- 图片 结束 -->
                    <!-- 文字 开始 -->
                    <div class="right fr">
                        <div class="top">
                            <span>8-14, 2018</span>
                        </div>
                        <div class="bottom">
                            <a href="#">这里是若维俱乐部的新闻内容...</a>
                        </div>
                    </div>
                    <!-- 文字 结束 -->
                </div>
                <div class="row">
                    <!-- 图片 开始 -->
                    <div class="left fl">
                        <img src="images/多条新闻编播.png">
                    </div>
                    <!-- 图片 结束 -->
                    <!-- 文字 开始 -->
                    <div class="right fr">
                        <div class="top">
                            <span>8-14, 2018</span>
                        </div>
                        <div class="bottom">
                            <a href="#">这里是若维俱乐部的新闻内容...</a>
                        </div>
                    </div>
                    <!-- 文字 结束 -->
                </div>
                <!-- 资讯内容结束 -->
            </div>
            <!-- 右侧 结束 -->
        </div>
        <!-- 去掉左边的空白 开始 -->
    </div>
    <!-- 内容 结束  -->

    <div id="footerPage"></div>
</body>

<script src="js/jquery.js"></script>
<script src="js/hearder.js"></script>
<script>
    $(function () {
        $('#headerPage').load('header.html');
        $('#footerPage').load('footer.html');
    })
</script>

<script type="text/javascript">
    var obj = '';
    var globalurl = 'http://123.206.47.215:8081';
    $(function () {
        $.ajax({
            //url: './testData/newsData.json',
            url: globalurl + '/club_news/showNewsList',
            type: 'POST',
            dataType: 'json',
            success: function (data) {
                //方法中传入的参数data为后台获取的数据
                obj = eval(data.data);
                var divA = document.getElementById("newslist");
                strsum = '';
                for (i in data.data.raws) {
                    if(i >= data.data.count)
                    {
                        break;
                    }
                    strsum = strsum 
                    + '<li>'
                    + '<a href="./newsDetail.html?id='+ data.data.raws[i].id+ '">'
                    + '<div class="outline">'
                    + '<div class="time"> '
                    + '<div class="day">'
                    + '12'
                    + '</div>'
                    + '<div class="year">'
                    + '2018-6'
                    + '</div>'
                    + '</div>'
                    + '<div class="title">'
                    + data.data.raws[i].title
                    + '</div>'
                    + '</div>'
                    + '<hr>'
                    + '</a>'
                    + '</li>';
                }
                divA.innerHTML = divA.innerText + strsum;
            },
            error: function () {
                alert('接收数据错误！');
            }
        })
    })
</script>


</html>